<style lang="scss" scoped>
    .sidebar{
        width: 160px;
        height: 100%;
        margin-top: 20px;
        >*{
            display: block;
            width: 100%;
            text-align: 2rem;
            color: rgba(black,.5);
            padding: 15px;
            padding-left: 30px;
            font-size: 16px;
            &:hover,&.router-link-active{
                color: orange;
                background-color: rgb(250,250,250);
            }
        }
    }
</style>
<template>
    <div class="sidebar">
        <router-link v-for="item in navList" :key="item.path" :to="item.path">
            <icon :name="item.ico"></icon>
            {{item.title}}
        </router-link>
    </div>
</template>
<script>
    export default {
        name:'ui-usercenterbar',
        data(){
            return {
                navActiveTab:'/user-all',
                navList:[
                    {title:'概览', path:'/user-all'},
                    {title:'我的评论',path:'/user-comments'},
                    {title:'我的互动',path:'/user-interactive'},
                    {title:'我的收藏',path:'/user-star'},
                    {title:'积分记录',path:'/user-score'},
                    {title:'个人资料',path:'/user-info'},
                    {title:'密码安全',path:'/user-save'},
                    {title:'反馈建议',path:'/user-feedback'},
                ],
            }
        },
        mounted(){
            
        },
    }
</script>